<template>
  <a-modal
    :width="1000"
    title="请选择"
    :visible.sync="editModalVisible"
    @cancel="handleCancleDbSync"
    :bodyStyle="{paddingLeft:'0px'}"
    >
      <template slot="footer">
        <a-button @click="handleCancleDbSync">
          关闭
        </a-button>
        <a-button type="primary" @click="handleDbSync" >确定</a-button>
      </template>
      <a-tabs v-model="activeKey" tab-position="left">
        <a-tab-pane key="1" tab="主管领导">
          <a-form-model>
            <a-form-model-item label="获取人字段" help="指定获取上级领导的人员字段">
              <a-input placeholder="" v-model="userKey" />
            </a-form-model-item>
          </a-form-model>
          <a-table
            size="middle"
            bordered
            row-key="id"
            :columns="positionColumns"
            :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange,type: getType}"
            :dataSource="loadPositionData"
          >
          </a-table>
        </a-tab-pane>
        <a-tab-pane key="2" tab="表达式">
          <s-table
            size="middle"
            bordered
            row-key="id"
            :columns="columns"
            :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange,type: getType}"
            :data="loadData_"
            >
          </s-table>
        </a-tab-pane>
      </a-tabs>
  </a-modal>
</template>
<script>
import STable from '@/components/Xtable'
import { getAction } from '@/api/manage'
import { initDictOptions } from '@/components/dict/JDictSelectUtil'
export default {
  name: 'PositionAndExpressionModal',
  components: {
    STable
  },
  computed: {
    // 计算属性的 getter
    getType: function() {
      return this.multi === true ? 'checkbox' : 'radio'
    }
  },
  data() {
    return {
      editModalVisible: false,
      multi: false,
      selectedRowKeys: [],
      selectionRows: [],
      activeKey: '1',
      columns: [
        {
          title: '#',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: 'center',
          customRender: function(t, r, index) {
            return parseInt(index) + 1
          }
        },
        {
          title: '表达式名称',
          align: 'center',
          dataIndex: 'name',
          ellipsis: true
        },
        {
          title: '表达式',
          align: 'center',
          dataIndex: 'expression',
          ellipsis: true
        }
      ],
      positionColumns: [
        { title: '#', dataIndex: '', key: 'rowIndex', width: 60, align: 'center',
          customRender: function(t, r, index) {
            return parseInt(index) + 1
          }
        },
        { title: '职级', dataIndex: 'title', align: 'center' },
        { title: '职级编码', dataIndex: 'value', align: 'center' }
      ],
      url: {
        list: '/online/cgform/api/getData/c7888dfa2282456f9fd17ae2a1ded5f0',
        positionList: '/sys/position/list'
      },
      queryParam: { },
      loadData_: parameter => {
        return getAction(this.url.list, Object.assign(parameter, this.queryParam)).then(res => {
          const data = res.result
          data.current = parameter.pageNo
          return data
        })
      },
      loadPositionData: [],
      userKey: 'create_by'
      // loadPositionData: parameter => {
      //   return getAction(this.url.positionList, Object.assign(parameter, this.queryParam)).then(res => {
      //     const data = res.result
      //     return data
      //   })
      // }
    }
  },
  methods: {
    handleCancleDbSync() {
      this.editModalVisible = false
    },
    handleDbSync() {
      this.editModalVisible = false
      const keys = []
      const key = this.activeKey === '1' ? 'value' : 'expression'
      this.selectionRows.forEach(item => {
        keys.push(item[key])
      })
      let values = ''
      if (this.activeKey === '1') {
        values = '${actUserService.getDepartLeaders(' + this.userKey + ',' + keys.join(',') + ')}'
      } else {
        values = keys.join(',')
      }
      this.$emit('ok', values)
    },
    onSelectChange(selectedRowKeys, selectionRows) {
      this.selectedRowKeys = selectedRowKeys
      this.selectionRows = selectionRows
    }
  },
  mounted() {
    initDictOptions('position_rank').then(res => {
      this.loadPositionData = res.result
    })
  }
}
</script>
<style lang="less">

</style>
